var sel = $("select"),
	ul,
	abc,
	is_key,
	timer;
inception_ajax(sel.val());
//数据选择
sel.change(function() {

	is_key = false;
	inception_ajax(sel.val());
})
//数据请求
function inception_ajax() {
	$.ajax({
		type: "get",
		url: "http://build.bluej.cn/api/index/get_carousel/",
		async: true,
		success: function(res) {
			srll(res);
		},
		data: {
			"position_id": sel.val()
		},
	});
}
//加载
function acv() {
	if(!is_key) {
		var wri = $(".wri"),
			sexq = $(".sexq"),
			rocket = $(".rocket"),
			carousel_img = $(".qimg"),
			a = 0;
		carousel_img.each(function(index1, obj) {
			obj.complete ? a++ : "";
			a == carousel_img.length ? wri.css("display", "none") + sexq.css("display", "block") + window.clearTimeout(abc) + (is_key = true) + carousel() : wri.css("display", "block") + sexq.css("display", "none") + rocket.text((a / carousel_img.length * 100).toFixed(2) + "%");
		})
		abc = setTimeout(acv, 100);
	}
}
//生成图片和小圆点
function srll(res) {
	var res_ajax = $(res.data),
		ul = $(".carousel_box ul"),
		carousel_box = $(".carousel_box");
	ul.html("");
	$("ol").remove();
	res_ajax.each(function(index, obj) {
		ul.append("<li class='img_all img_" + (index + 1) + "'><img class='qimg' src='http://build.bluej.cn" + obj.ch_img_url + " ' /></li>");
		index == 0 ? carousel_box.append("<ol class='activeall'><li class='active'></li></ol>") : $("ol").append("<li></li>");
	})
	acv();
}

function carousel() {
	var left_arrow = $(".left_arrow"),
		right_arrow = $(".right_arrow"),
		carousel_det = $(".img_all"),
		is_run = false,
		now_index = 0,
		carousel_box = $(".carousel_box"),
		controls = $(".activeall li"),
		ul = $(".carousel_box ul");
	window.clearInterval(timer);
	ul.css("transition", "none");
	ul.currentStyle ? console.dir(ul.currentStyle) : ul.css("transform");
	ul.css("transform", "translateX(-0%)");
	ul.css("transition").indexOf("none") == 0 ? ul.css("transition", "") : "";
	//右边轮播控制
	right_arrow.click(function() {
		!is_run ? (is_run = true) + (++now_index >= carousel_det.length ? (right_run(now_index)): run(now_index)) : "";
	})
	//左边轮播控制
	left_arrow.click(function() {
		!is_run ? (is_run = true) + (--now_index <= -1 ? (left_run(now_index)) : run(now_index)) : "";
	})
	//圆点控制
	controls.each(function(index, obj) {
		$(obj).mousemove(function() {
			now_index = index;
			window.clearInterval(timer);
			run(now_index);
		})
	})
	//自动轮播
	function auto_play() {
		timer = setInterval(function() {
			is_run = true;
			++now_index >= carousel_det.length ? (right_run(now_index)): run(now_index);
		}, 2000)
	}
	auto_play(now_index);
	//移入停止轮播
	carousel_box.on("mousemove", function() {
		window.clearInterval(timer);
	})
	//移出自动轮播
	carousel_box.on("mouseleave", function() {
		auto_play(now_index);
	})
	//轮播图运行主函数
	function run() {
		ul.css("transform", "translateX(-" + now_index * 100 + "%)");
		controls.eq(now_index).addClass("active").siblings().removeClass("active");
		is_run = false;
	}
	//右边界轮播
	function right_run(target_index) {
		new_li = carousel_det.filter(":first-child").clone().appendTo(ul);
		ul.css("transform", "translateX(-" + target_index * 100 + "%)");
		controls.eq(0).addClass("active").siblings().removeClass("active");
		now_index = 0;
		ul.on("transitionend", right_end);

		function right_end() {
			ul.css("transition", "none");
			ul.css("transform", "translateX(0%)");
			ul.currentStyle ? console.dir(ul.currentStyle) : ul.css("transform");
			ul.css("transition", "");
			new_li.remove();
			is_run = false;
			ul.off("transitionend", right_end);
		}
	}
	//左边界轮播
	function left_run(target_index) {
		new_li = carousel_det.filter(":last-child").clone().insertBefore(carousel_det.filter(":first-child"));
		ul.css("transition", "none");
		ul.css("transform", "translateX(-" + 100 + "%)");
		ul.currentStyle ? console.dir(ul.currentStyle) : ul.css("transform");
		ul.css("transition", "");
		ul.css("transform", "translateX(-0%)");
		ul.on("transitionend", left_end);
		now_index = carousel_det.length - 1;
		controls.eq(carousel_det.length - 1).addClass("active").siblings().removeClass("active");

		function left_end(now_index) {
			ul.css("transition", "none");
			ul.css("transform", "translateX(-" + ((carousel_det.length) - 1) * 100 + "%)");
			ul.currentStyle ? console.dir(ul.currentStyle) : ul.css("transform");
			ul.css("transition", "");
			new_li.remove();
			ul.off("transitionend", left_end);
			is_run = false;
		}
	}
}